<!doctype html>
<html lang="zh" class="no-js">
<head>
	<base th:href="${#request.getContextPath()}+'/'">
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="css/login-style.css"> <!-- Gem style -->
	<link rel="shortcut icon" href="favicon.ico">
	<!--[if lt IE 9]>
	<meta http-equiv="refresh" content="0;ie.html"/>
	<![endif]-->
	<script>
		if (window.top !== window.self) {
			window.top.location = window.location;
		}
	</script>
</head>
<body>
	<div style="z-index: 10000;
    position: absolute;
    top: 0;
    left:calc(50% - 244px);
		"  class="cd-user-modal is-visible"> <!-- this is the entire modal form, including the background -->
		<div class="cd-user-modal-container">
			<div class="system-title" ><span>畜牧源物联平台</span></div>

			<div id="cd-login" class="is-visible is-selected"> <!-- log in form -->
				<form id="login-form" class="cd-form">
					<p class="fieldset">
						<label class="image-replace cd-username" for="username">账户名</label>
						<input class="full-width has-padding has-border" AUTOCOMPLETE="off" id="username"
							   name="username" type="phone" placeholder="请输入账户名">
					</p>
					<p class="fieldset">
						<label class="image-replace cd-password" for="password">密码</label>
						<input class="full-width has-padding has-border" AUTOCOMPLETE="off" id="password"
							   name="password" type="password" placeholder="请输入密码">
					</p>
					<p class="fieldset">
						<input type="checkbox" id="remember-me" checked>
						<label for="remember-me">记住密码</label>
					</p>
					<p class="fieldset">
						<input class="full-width" type="button" value="登录" onclick="login()">
					</p>
				</form>
			</div> <!-- cd-login -->

		</div> <!-- cd-user-modal-container -->

	</div> <!-- cd-user-modal -->

	<!-- //copyright -->
	<script th:inline="javascript"> var ctx = [[${#request.getContextPath()}]];</script>
	<!-- 全局js -->
	<script src="js/jquery.min.js?v=2.1.4"></script>

	<script src="js/plugins/layer/layer.min.js" ></script>
	<script type="text/javascript">
		$(document).ready(function () {
			$("#login-button").on('click', function () {
				login();
			});
			$("body").keydown(keyDownLogon);
		});

		function login() {
			if($('#username').val()==''){
				layer.msg('请输入您的账号');
				return;
			}
			if($('#password').val()==''){
				layer.msg('请输入您的密码');
				return;
			}
			$.ajax({
				type: "POST",
				url: ctx + "/login",
				data: $('#login-form').serialize(),
				success: function (r) {
					if (r.code == 0) {
						var index = layer.load(1, {
							shade: [0.1, '#fff'] //0.1透明度的白色背景
						});
						parent.location.href = ctx +'/index?from=pc';
					} else {
						layer.msg(r.msg);
					}
				},
			});
		}

		function keyDownLogon() {
			if (event.keyCode == "13") {
				$("#login-button").trigger('click');
			}
		}

	</script>
</body>
</html>
